<template>
  <scroll-view
    :scroll-x="scroll.x"
    :scroll-y="scroll.y"
    class="scroll-container"
    :class="className"
  >
    <list-scroll-view
      v-model="refreshing"
      @refresh="onRefresh"
      @load="onLoad"
    >
      <column
        :format="item.format"
        :title="item.title"
        :description="item.description"
        :medias="item.medias"
        v-for="(item,index) in list"
        :key="index"
        @click="pushNativelink(item.mplink)"
      />
    </list-scroll-view>
  </scroll-view>
</template>

<script>
import ListScrollView from '@/components/listScrollView/index'
import Column from '@/components/column/index'
// import MPRequest from '@/utils/request'
export default {
  components: {
    Column,
    ListScrollView
  },
  props: {
    list: [],
    url: {
      type: String,
      default: ''
    },
    className: {
      type: String,
      default: ''
    },
    scroll: {
      type: Object,
      default: {
        x: false,
        y: true
      }
    }
  },
  data () {
    return {
      indicatorDots: true,
      vertical: false,
      autoplay: false,
      interval: 2000,
      duration: 500,
      items: [],
      refreshing: false,
      triggered: false,
      freshing: false,
      page: 1, // 当前页数
      meta: {
        totalCount: 0,
        pageCount: 0,
        currentPage: 0,
        perPage: 0
      }
    }
  },
  watch: {},
  computed: {},
  onLoad (option) {
    console.log('onLoad options:', option)
    // if (option.id) {
    //   this.categoryId = parseInt(option.id)
    // }
  },
  beforeMount () {
    console.log('url::::', this.url)
    // this.getList()
  },
  mounted () {
    console.log('list data', this.list)
  },
  methods: {
    onRefresh () {
      // 初始化页码
      this.page = 1
      // this.getList()
    }
    // 获取数据方法
    // getList () {
    //   console.log('event/index getList')
    //   const that = this
    //   that.refreshing = false
    //   let startTime = new Date()
    //   let params = {
    //     page: that.page // 传递页码
    //   }
    //   MPRequest.get(this.url, params).then(res => {
    //     // 返回的数据
    //     console.log('data', res)
    //     // 关闭下拉刷新动画
    //     wx.stopPullDownRefresh()

    //     let itemCount = res.items.length
    //     if (itemCount > 0) {
    //       if (that.page > 1) {
    //         that.list.push(...res.items)
    //       } else {
    //         that.list = res.items
    //       }
    //     }
    //     that.meta = res.meta

    //     let endtime = new Date()
    //     let duration = endtime - startTime
    //     if (duration < 1500) {
    //       console.log('duration', duration)
    //       setTimeout(() => {
    //         that.refreshing = true
    //       }, 1500 - duration)
    //     } else {
    //       that.refreshing = true
    //     }
    //     console.log('change refreshing to', that.refreshing)
    //     that.triggered = false
    //     that.freshing = false
    //   })
    // }
  }
}
</script>

<style lang="less">
.scroll-container {
  height: 100%;
}
.swiper-corner {
  margin: 15px 0;
}

.demo-text-1 {
  background-color: rgb(142, 226, 14);
}
.demo-text-2 {
  background-color: tomato;
}
.demo-text-3 {
  background-color: rgb(248, 186, 29);
}
.hot-group {
  padding: 15px;

  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;

  &-cell {
    flex-basis: 50%;
    .van-cell {
      padding: 10px;
      &__value {
        flex: none;
        -webkit-flex: none;
      }
    }

    image {
      width: 30px;
      height: 30px;
    }
  }
}
</style>
